<template>
	<view class="content">
		<u-sticky>
			<baseNavbarHome title="本地草稿" />
		</u-sticky>
		<view class="contentBox">
			<view class="contentBox1" v-for="item in followNode" :key="item.id">
				<view class="cover" @click="jumpSourismSchedule(item)">
					<image :src="item.images ? item.images[0] : ''" mode="aspectFill"
						class="box-img1"></image>
					<image v-if="item.images.length<=0" src="/static/image/icon/draft.png" class="draft-icon"></image>
					<!-- <u-line color="#ccc"></u-line> -->
				</view>
				<view class="padding_l_r18">
					<view class="box-text color_222222 text-beyond-multi2">{{ item.title }}</view>
					<view class="box-bottom">
						<view class="head">
							{{ timeago(item.createTime) }}
						</view>
						<view class="aixin">
							<image src="/static/image/icon/delete.png" mode="" class="head-img"
								@click="doDelete(item.planUuid)"></image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<u-modal :show="isShow" title="温馨提示" :showCancelButton="true" @confirm="sure" @cancel="isShow = false">
			<view style="text-align: center;">您将删除本条数据 删除后不可恢复 确定要删除吗？</view>
		</u-modal>
	</view>
</template>

<script setup>
	import baseNavbarHome from '@/components/base-navbar-home.vue';
	import {
		timeago
	} from "@/utils/common.js";
	import {
		ref,
		getCurrentInstance
	} from "vue";

	import {
		onReady,
		onLoad,
		onShow
	} from '@dcloudio/uni-app';
	const {
		proxy
	} = getCurrentInstance()
	const followNode = ref()
	const isShow = ref(false)
	const ids = ref()
	const fans = async () => {
		const res = await proxy.$api.myData2(0)
		followNode.value = res.data
	}
	const doDelete = (id) => {
		isShow.value = true
		ids.value = id
	}
	const sure = async () => {
		const res = await proxy.$api.updateStatus(ids.value, -1)
		if (res.code === "10000") {
			uni.showToast({
				title: "删除成功",
				duration: 2000
			})
			isShow.value = false
			fans()
		} else {
			uni.showToast({
				title: "删除失败",
				duration: 2000,
				icon: "error"
			})
		}
	}

	const jumpSourismSchedule = (item) => {
		uni.navigateTo({
			url: `/tourism-schedule-pages/tourism-schedule/tourism-schedule?planUuid=${item.planUuid}`
		})
	}

	onShow(() => {
		fans()
	})
</script>

<style scoped lang="scss">
	.content {
		min-height: 100vh;
		background-color: #f8f8f8;

		.contentBox {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			padding: 0 20rpx;
			margin-top: 20rpx;
			box-sizing: border-box;

			.cover {
				width: inherit;
				height: 314rpx;
				position: relative;
			}

			.draft-icon {
				width: 100rpx;
				height: 100rpx;
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
			}

			.contentBox1 {
				width: 346rpx;
				background-color: #FFF;
				border-radius: 8rpx;
				margin-bottom: 20rpx;
				padding-bottom: 20rpx;

				.box-img1 {
					width: inherit;
					height: 314rpx;
					border-radius: inherit;
				}

				.box-text {
					min-height: 80rpx;
					margin-top: 16rpx;
					font-weight: 500;
					font-size: 28rpx;
				}

				.box-bottom {
					display: flex;
					justify-content: space-between;
					align-items: center;
					margin-top: 16rpx;
				}

				.head {
					font-family: PingFang SC;
					font-size: 20rpx;
					font-weight: 400;
					color: #6D6D6D;
				}

				.head-img {
					width: 32rpx;
					height: 32rpx;
				}

				.aixin {

					width: 32rpx;
					height: 32rpx;
				}
			}
		}
	}
</style>